<template>
  <div class="BatchCollect">
      <el-dialog 
        title="批 量 编 辑 收 样 员" :center="true" width="500px"
        :visible.sync="dialogFormVisible">
        <el-form :model="dataForm" ref="dataForm" :rules="roleRules">
            <el-form-item label="选择收样员" prop="collectList">
                <el-select 
                    v-model="dataForm.collectList" 
                    filterable clearable
                    reserve-keyword multiple 
                    placeholder="请选择收样员">
                    <el-option
                        v-for="item in pickSyUserList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item align="center">
                <el-button type="primary" plain @click.native="clickCommit">确 定</el-button>
                <el-button @click.native="clickCancel">取 消</el-button>
            </el-form-item>
        </el-form>
      </el-dialog>
  </div>
</template>

<script>
import * as message from "@/constants/message";
import AuthApi from "@/api/system/auth";
import ReportApi from '@/api/report/report';
export default {
    name: 'BatchEditCollect',
    props: {
        collectList:{
            type: Array,
            default: null
        },
    },
    data () {
        return{
            pickSyUserList:[],
            selectIds:[],
            dataForm:{
                collectList:[],
            },
            selectIds:[],
            dialogFormVisible: false,
            roleRules:{
                collectList:[
                    { required: true, message: "请选择收样员", trigger: "blur" }
                ]
            }
        }
    },
    created(){
       this.listSyUser();
    },
    methods:{
        listSyUser(){
            let _this = this
            AuthApi.listAdminByRole({roleId: 4})
            .then(res => {
            setTimeout(() => {
            _this.pickSyUserList = res.data.map(item => {
                return {
                value: item.userId,
                label: item.userName
                }
            })
            }, 200)
        })
        },
        clickCommit(){
            // 提交 获取父组件的值
            console.log(this.selectIds,this.dataForm.collectList.length);
            var collectLength = this.dataForm.collectList.length;
            if(collectLength <= 3 ){
                this.addData();
            }else{
                this.$notify.error({
                    title: message.TITLE_PROMPT,
                    message: "最多选择三个收样员,请检查！"
                })
                return
            }
        },
        addData(){
            // 待发送请求
            let _this = this
            var cond ={
                reportIdList: _this.selectIds,
                collectUserIdList: _this.dataForm.collectList
            }
            ReportApi.batchEditCollect(cond)
            .then(res =>{
                _this.$Utils.notifySuccess();
                this.clickCancel();
            })
        },
        clickCancel(){
            this.$parent.init();
            this.dialogFormVisible = false;
        },
        handleCreate(val){
            // 父组件调动子组件方法
            this.selectIds=val;
            this.dialogFormVisible = true;
            this.dataForm.collectList = [];
        }
    }
}
</script>

<style>

</style>